
let refreshCurrentButton = document.getElementById('refreshCurrentButton');
refreshCurrentButton.onclick = () => {
  let current = new Date();
  document.getElementById('currentDate').value = date2format(current);
  document.getElementById('currentTimestamp').value = current.getTime();
}
refreshCurrentButton.onclick();

let cleanHistory = document.getElementById('cleanHistory');
cleanHistory.onclick = () => {
  console.log("clean history")
  // localStorage.setItem('historyTrans', "[]");
  history = history.splice(0,history.length / 2);
  updateHistory();
}

// let tsTextField = document.getElementById('timestamp');
// tsTextField.onchange = (e,e2) => {
//   let ts = tsTextField.value;
//   if (ts > 1000000000000 && ts < 2000000000000) {
//     timestamp2Date(ts);
//   }
// }
// tsTextField.onpaste = tsTextField.onchange;


let timestamp2DateButton = document.getElementById('timestamp2DateButton')
timestamp2DateButton.onclick = () => {
  let ts = document.getElementById('timestamp').value;
  console.log(ts)
  timestamp2Date(ts)
}

let history = JSON.parse(localStorage.getItem('historyTrans') || "[]");
let heighLight = -1
function updateHistory(data) {
  if (data != null) {
    heighLight = -1;
    for(i in history) {
      let d = history[i];
      if (d[0] == data[0] || d[0] == data[1] ||
        d[1] == data[0] || d[1] == data[1]) {
        //有存在的数据
        heighLight = i;
        break;
      }
    }
    if (heighLight == -1) {
      history.splice(0, 0, data);
      // history.push(data);
      heighLight = 0;
    }
  }
  displayHistory();
  localStorage.setItem('historyTrans', JSON.stringify(history));
}

function displayHistory() {
  let historyList = document.getElementById('historyList');
  let s = "";
  historyList.innerHTML = "";
  if (heighLight >= 0 && heighLight < history.length) {
    let ooo = history.splice(heighLight, 1);
    history.splice(0, 0, ooo[0]);
    heighLight = 0;
  }
  for(index in history) {
    let node = document.createElement("li");
    node.className = "history-list-item";
    if (index == heighLight) {
      node.style="color:#3ece99";
    }

    let sp1 = document.createElement("span");
    sp1.innerText = history[index][0]
    sp1.onclick = () => {
      useHistory(sp1.innerText);
    }

    let spSep = document.createElement("span");
    spSep.style.padding = "0 8px";
    spSep.innerText = " --> "
    let idx = index;
    spSep.onclick = () => {
      history.splice(idx, 1);
      heighLight = -1;
      updateHistory();
    }

    let sp2 = document.createElement("span");
    sp2.innerText = history[index][1]
    sp2.onclick = () => {
      useHistory(sp2.innerText);
    }

    node.appendChild(sp1);
    node.appendChild(spSep);
    node.appendChild(sp2);

    historyList.appendChild(node);
  }
}
displayHistory();

let date2TimestampButton = document.getElementById('date2TimestampButton')
date2TimestampButton.onclick = () => {
  let year = document.getElementById('year').value || 1970;
  let month = document.getElementById('month').value || 1;
  let day = document.getElementById('day').value || 1;
  let hour = document.getElementById('hour').value || 0;
  let minute = document.getElementById('minute').value || 0;
  let second = document.getElementById('second').value || 0;

  let s = year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + second;
  let date = new Date(s);
  
  let out = document.getElementById('timestampData');
  out.value = date.getTime();

  updateHistory([s, date.getTime()]);
}

function timestamp2Date(ts) {
  if (ts.length < 13) {
    ts += "000";
  }
  ts = parseInt(ts);
  let out = document.getElementById('dateData');
  if (ts >= 0 && ts < 2000000000000) {
    let date = new Date(ts);
    let ss = date2format(date);
    out.value = ss;
    out.style.color = '#000';
    updateHistory([ts, ss]);
  } else {
    out.style.color = '#f00';
  }

}

function date2format(date) {
  return (1900 + date.getYear()) + "-" + (date.getMonth() + 1) + "-" + (date.getDate()) + " " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds() + "." + date.getMilliseconds();
}

function useHistory(data) {
  if (data.indexOf(":") != -1) {
    useDate(data);
  } else {
    useTimestamp(data);
  }
}
function useTimestamp(timestamp) {
  console.log(timestamp)
  document.getElementById('timestamp').value = timestamp;
}
function useDate(date) {
  console.log(date)
  let d = new Date(date);

  document.getElementById('year').value = (1900 + d.getYear());
  document.getElementById('month').value = (d.getMonth() + 1);
  document.getElementById('day').value = d.getDate();
  document.getElementById('hour').value = d.getHours();
  document.getElementById('minute').value = d.getMinutes();
  document.getElementById('second').value = d.getSeconds();
}